<script setup lang="ts">
import { reactive } from 'vue';

const props: any = defineProps<{
    ujt: any;
}>();
const { $global, $fn, $ws } = props.ujt;

// 初始化WS默认连接状态
$fn.useWs(props.ujt, 'cocontrol');
$fn.ws['cocontrol'].init();

const rfKddData: any = reactive({
    wsinfoapi: {
        ty: 'asaiws/testapi',
        db: '{aa:1}',
    },
    wsinfolisten: {
        ty: 'asaiws/testlisten',
        db: $global.user.info.us,
        tc: 1500, // tc用来处理设置返回消息体的时间间隔
        pb: 2, // pb回消息的人群范围，0=自己；1=除自己之外所有人；2=所有人
    },
    res: '',
    reslisten: '',
});
function testWsApi() {
    $fn.ws['cocontrol']
        .wsApi(rfKddData.wsinfoapi)
        .then((res: any) => {
            rfKddData.res = res;
        })
        .catch((err: any) => {});
}

function testWsListen() {
    rfKddData.wsinfolisten.off = 0;
    $fn.ws['cocontrol'].wsWatch(rfKddData.wsinfolisten, (res: any) => {
        rfKddData.reslisten = res;
    });
}
function testWsListenOff() {
    rfKddData.wsinfolisten.off = 1;
    $fn.ws['cocontrol'].wsWatchOff(rfKddData.wsinfolisten);
}
</script>

<template>
    <div class="as-server-area" v-userlevel="{ ujt, lv: 9 }">
        <h2>调试设置</h2>
        <div>
            <AsLink :ujt="ujt"></AsLink>
        </div>

        <h2>与控制器的通信测试(连接状态：{{ $ws['cocontrol']?.open }})</h2>
        <p>控制器通信配置文件：**\webmodel\sys\server.json</p>

        <h2>请求测试</h2>
        <p>
            ty:
            <input type="text" v-model="rfKddData.wsinfoapi.ty" />
            db:
            <input type="text" v-model="rfKddData.wsinfoapi.db" />
        </p>
        <p><button @pointerdown="testWsApi()">testWsApi</button></p>
        <p v-if="rfKddData.res">API返回值：{{ rfKddData.res }}</p>

        <h2>监听测试</h2>
        <p>
            ty:
            <input type="text" v-model="rfKddData.wsinfolisten.ty" />
            db:
            <input type="text" v-model="rfKddData.wsinfolisten.db" />
        </p>
        <p>
            时间间隔:<input type="text" v-model="rfKddData.wsinfolisten.tc" />
            接收人群:
            <select v-model="rfKddData.wsinfolisten.pb">
                <option :value="0">自己</option>
                <option :value="1">除自己之外所有人</option>
                <option :value="2">所有人</option>
            </select>
        </p>
        <p>
            <button @pointerdown="testWsListen()">testWsListen</button>
            <button @pointerdown="testWsListenOff()">testWsListenOff</button>
        </p>
        <p v-if="rfKddData.reslisten">Watch监听值：{{ rfKddData.reslisten }}</p>
    </div>
</template>

<style scoped lang="scss">
.as-server-area {
    * {
        font-size: var(--fs2);
    }
    h2 {
        padding: 8px 20px;
        background-color: var(--cm2);
    }
    input,
    select,
    option {
        background-color: var(--ch0);
        padding: 5px 12px;
    }
    button {
        cursor: pointer;
        height: 52px;
        padding: 5px 12px;
        margin: 5px 20px;
        background-color: var(--cm8);
        color: var(--ch0);
    }
    p {
        padding: 5px 20px;
        margin: 0;
    }
}
</style>
